{{ template "header.html" . }}

<div class="content">
  <h2 class="content-title">
      {{ if eq (extra "lang") "en" }}
      Log in to Your Account:
      {{ else }}
      Введите ваши данные:
      {{ end }}
  </h2>
  <form method="post" action="{{ .PostURL }}" class="grid">
    <div>
      <label for="login" class="input-label">{{ .UsernamePrompt }}:</label>
	    <input tabindex="1" required id="login" name="login" type="text" class="input" {{ if .Username }} value="{{ .Username }}" {{ else }} autofocus onfocusout="this.value = this.value.trim()" {{ end }}/>
    </div>
    <div>
      <label for="password" class="input-label">
          {{ if eq (extra "lang") "en" }}
          Password:
          {{ else }}
          Пароль:
          {{ end }}
      </label>
      <input tabindex="2" required id="password" name="password" type="password" class="input" {{ if .Invalid }} autofocus {{ end }}/>
    </div>

    {{ if .Invalid }}
      <div id="login-error" class="form-error">
        {{ if eq (extra "lang") "en" }}
        Invalid {{ .UsernamePrompt }} or password.
        {{ else }}
        Неверный {{ .UsernamePrompt }} или пароль.
        {{ end }}
      </div>
    {{ end }}
    <button tabindex="3" id="submit-login" type="submit" class="btn btn-primary">
        {{ if eq (extra "lang") "en" }}
        Sign in
        {{ else }}
        Войти
        {{ end }}
      <img src="{{ url $.ReqPath "static/img/next-icon.svg" }}" />
    </button>
  </form>
  {{ if .BackLink }}
  <div class="form-extra">
    <a class="btn btn-primary-outline" href="{{ .BackLink }}">
      <img src="{{ url $.ReqPath "static/img/prev-icon.svg" }}" />
      {{ if eq (extra "lang") "en" }}
      Select another login method
      {{ else }}
      Выбрать другой метод
      {{ end }}
    </a>
  </div>
  {{ end }}
</div>

<script type="text/javascript">
  document.querySelector('form').onsubmit = function(e) {
    var el = document.querySelector('#submit-login');
    el.setAttribute('disabled', 'disabled');
  };
</script>

{{ template "footer.html" . }}
